This is were Html is extremely Awesome to use, since it provides the ability to link from one document page to the next, just by clinking on the hyperlinks. It is possible to setup hyperlinks using both text or images. For the moment we shall only be concerned with hyperlinks applied to text. The exact same principles described here for text links also apply to images which are discussed later.

To set up a link, we use an anchor element <A> with its relative attributes. Lets begin with setting up a link to another web document in the current directory. I will illustrate this by setting up a link to a document called Dpage.html in this current directory. This is simply done by using the HREF attribute as shown below.

The filename of the document is inserted after the HREF attribute (Dpage.html) and the text which is to be hyper linked is inserted between the start and end element (Click Here to link to Dpage.html). On moving the pointer over the link, it should transform into a hand indicating a link. Clinking on the link should transport you over to the Dummy page from were there is a link back here.

Try it.

The above link should be in blue, since i have included the link attribute in the body tag element telling the browser that the links should be in blue on this page.This will NOT override any preferences set by the browser and hence the link may not be blue. Note you do not need to underline the links as I have above. But i find it useful when web pages contains coloured text. Of course older browsers will not recognize the <u> tag element. Therefore it will not underline the text.
Recent browsers will give you the option to underline links, irrespective if they contain the underline element or not.

You can also open documents in Subdirectories off the current directory. Lets set up a link to the document Dpage1.html in the directory called SubDirec off this current directory. You enter the path of the file as you would in dos. ie.

As before the link appears in blue (or browsers pref.) and is underlined. Clinking on the link, you will see that the address in the address bar will change to include the above path. Click on the link to see how to link back to this document in this parent directory.

The above links are known as Relative links since they refer to files which are relative to the current directory.
Yes but you want to link to other web sites all over the place. In this situation you need to use Absolute links where you include the full path of the file. Below is the full path for The University Of Sheffield home page and for the file Dpage1.html which I have used above.

So when setting links, it is necessary to use Absolute links when linking to other web documents.
It is a good idea to check the links on your pages once in a while to make sure the links are still active, since some web addresses tend to change from time to time. Where ever possible it is better and quicker to use relative links. It helps when you move your web pages to new site, since most of the links in your pages are relative and therefore will not need changing. cool!

We now move on to another attribute known as the named anchor ( Name).
We can use this as a target anchor to move to specific sections of a web document or some other web document. On some web pages you can click on specific words/images and you are transported to the relative section of that document or some other document. For example if web document is very long in length, then it is useful to set up a contents page at the beginning where the surfer can link to the relative section of that document without the need of scrolling through the entire document.
We will set up two anchors here, one which takes us to the top of the web page and the other to the link which would take us to the page Dpage.html. The first thing we need to do is to set up the anchors as below

This should give the following

To link to an anchor point in a different web page, we use the same HTML Source code, with a tiny extra bit. The anchor point in the other web page is set up as shown above. Note here the web page is in the same site/directory.

The filename of the web page is section1.html , and the name of the anchor point in this document we want to link to is rgbcolours. Note the hash # before the anchor name.

NOTE if the name anchor does not exist in the web page you are referring to, then by default you start at the top of the web page.
Another useful attribute to know about is the mailto attribute. This will automatically open the browsers mailing dialog option so the surfer can send an email to the author of the document, or whoevers email address follows the mailto attribute.

Finally some browsers support the Title attribute within the anchor <A>element, similar to the alt attribute described in the next section for images. Basically, when a user holds the mouse pointer over a link for a given amount of time, the text in the Title attribute is displayed in a popup tooltip fashion. This provides an additional way of providing further information relating to the link.